<template>
    <div class='order'>
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" >
            <el-form-item label="稿件名称" prop="name">
                <el-input v-model="queryParams.name" placeholder="请输入稿件名称" clearable @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button type="primary" plain icon="el-icon-plus" size="mini"  @click="handleAdd" v-hasPermi="['system:menu:add']" >新增</el-button>
            </el-form-item>
        </el-form>
        <el-table v-loading="loading" :data="list" >
            <el-table-column v-for='(it,inx) in columnlist' :key="inx" align="center" :label="it.label" :prop="it.prop" :width='it.width' />
            <el-table-column align="center" label="操作">
                <template slot-scope="scope">
                    <el-button @click="spktItem(scope.row)" type='text'>查看</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div style="text-align:right;margin-top:20px;" v-if='queryParams.total>0'>
            <el-pagination background layout="prev, pager, next" @current-change="handleQuery" :current-page.sync="queryParams.pageNum" :page-size="queryParams.pageSize" :total="queryParams.total"> </el-pagination>
        </div>
  </div>
</template>
<script>
import {selectOrders} from '@/api/pc.js'
export default {
    name:'order',
    data(){
       return{
        loading:false,
        // 表格搜索条件
        queryParams:{name:'',pageNum:1,pageSize:10,total:0},
        // 表格表头
        columnlist:[
            {label:'订单编号',prop:'orderNum'},
            {label:'文章标题',prop:'orderTitle'},
            {label:'选择服务',prop:'serviceName'},
            // {label:'增值服务',prop:'subjectName'},
            {label:'状态',prop:'stateName'},
            {label:'学科',prop:'subjectName'},
            // {label:'价格',prop:'subjectName'},
            {label:'提交时间',prop:'createTime',width:160},
        ],
        // 表格数组
        list:[]
       }
    },
    created(){this.getdata();},
    methods:{
        changefy(val){
            console.log(val)
        },
        handleQuery(){
            console.log(111)
            this.getdata();
        },
        handleAdd(){
            this.$router.push({path:'/orderSubmit'})
        },
        //获取列表
        getdata(){
            // let obj = {
            //     orderNum:"",
            //     orderTitle:this.queryParams.name,
            //     serviceId:"",
            //     userId:"",
            //     state:"",
            // }
            var formData = new FormData();
            formData.append('orderTitle',this.queryParams.name)
            formData.append('pageNum',this.queryParams.pageNum)
            formData.append('pageSize',this.queryParams.pageSize)
            selectOrders(formData).then(res=>{
                console.log(res)
                res.rows.forEach(it => {
                    it.stateName = it.state==0?'提交':it.state==0?'完成':'退回';
                });
                this.list = res.rows;
                this.queryParams.total = res.total || 0;
            })
        },
        //跳转
        spktItem(val){
            this.$router.push({path:'/orderDetails',query:{orderId:val.orderId}})
        },
    }
}
</script>
<style lang='scss' scoped>
.order{
    width: 100%;
    height: 100%;
    padding: 20px;
}
</style>